<%--
  User: icanci
  Date: 2020/10/6 19:01
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html>
    <jsp:include page="head.jsp"/>
    <style type="text/css">
        #imgPreview {
            width: 40%;
            height: 180px;
            margin: 10px auto 0px auto;
            /*border: 1px solid black;*/
            text-align: center;
        }

        #prompt3 {
            width: 100%;
            height: 180px;
            text-align: center;
            position: relative;
        }

        #imgSpan {
            position: absolute;
            top: 60px;
            left: 40px;
        }

        .filepath {
            width: 100%;
            height: 100%;
            opacity: 0;
        }

        #img3 {
            height: 100%;
            /*width: 100%;*/
            display: none;
        }

        #imgPreview_1 {
            width: 40%;
            height: 180px;
            margin: 10px auto 0px auto;
            /*border: 1px solid black;*/
            text-align: center;
        }

        #prompt3_1 {
            width: 100%;
            height: 180px;
            text-align: center;
            position: relative;
        }

        #imgSpan_1 {
            position: absolute;
            top: 60px;
            left: 40px;
        }

        #img3_1 {
            height: 100%;
            /*width: 100%;*/
            display: none;
        }


    </style>
    <script>
        function changepic() {
            $("#prompt3").css("display", "none");
            var reads = new FileReader();
            f = document.getElementById('file').files[0];
            reads.readAsDataURL(f);
            reads.onload = function (e) {
                document.getElementById('img3').src = this.result;
                $("#img3").css("display", "block");
            };
        }

        function changepic_1() {
            $("#prompt3_1").css("display", "none");
            var reads = new FileReader();
            f = document.getElementById('file_1').files[0];
            reads.readAsDataURL(f);
            reads.onload = function (e) {
                document.getElementById('img3_1').src = this.result;
                $("#img3_1").css("display", "block");
            };
        }
    </script>
    <body class="hold-transition skin-purple sidebar-mini">
        <div class="wrapper">
            <%-- 头部 --%>
            <jsp:include page="header.jsp"/>
            <%-- 头部 --%>
            <%-- 侧栏区域 --%>
            <jsp:include page="aside.jsp"/>
            <%-- 侧栏区域 --%>

            <!-- 内容区域 -->
            <div class="content-wrapper">
                <!-- 内容头部 -->
                <section class="content-header">
                    <h1>
                        数据管理
                        <small>票务详情</small>
                    </h1>
                    <ol class="breadcrumb">
                        <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
                        <li><a href="#">数据管理</a></li>
                        <li class="active">票务详情</li>
                    </ol>
                </section>
                <!-- 内容头部 -->

                <!-- 正文区域 -->
                <section class="content">
                    <form action="${pageContext.request.contextPath}/api/v1/pri/admin/update-ticket" method="post"
                          enctype="multipart/form-data">
                        <div class="box-body">
                            <div class="tab-pane" id="tab-common">
                                <div class="row data-type">
                                    <input type="hidden" name="ticketDetailsId" value="${jsonData.data.ticketDetailsId}">
                                    <div class="col-md-2 title">票名</div>
                                    <div class="col-md-4 data">
                                        <input name="ticketName" type="text" class="form-control" placeholder="票名"
                                               value="${jsonData.data.ticketDetailsInfo}">
                                    </div>
                                    <div class="col-md-2 title">票状态</div>
                                    <div class="col-md-4 data">
                                        <select name="ticketStatus" class="form-control">
                                            <c:if test="${jsonData.data.ticketDetailsStatus == 0}">
                                                <option selected value="0">已下架</option>
                                                <option value="1">在售中</option>
                                                <option value="2">在取消中</option>
                                                <option value="3">在退款中</option>
                                            </c:if>
                                            <c:if test="${jsonData.data.ticketDetailsStatus == 1}">
                                                <option value="0">已下架</option>
                                                <option selected value="1">在售中</option>
                                                <option value="2">在取消中</option>
                                                <option value="3">在退款中</option>
                                            </c:if>
                                            <c:if test="${jsonData.data.ticketDetailsStatus == 2}">
                                                <option value="0">已下架</option>
                                                <option value="1">在售中</option>
                                                <option selected value="2">在取消中</option>
                                                <option value="3">在退款中</option>
                                            </c:if>
                                            <c:if test="${jsonData.data.ticketDetailsStatus == 3}">
                                                <option value="0">已下架</option>
                                                <option value="1">在售中</option>
                                                <option value="2">在取消中</option>
                                                <option selected value="3">在退款中</option>
                                            </c:if>
                                        </select>
                                    </div>
                                    <div class="col-md-2 title">是否为秒杀</div>
                                    <div class="col-md-4 data">
                                        <select name="isKilled" class="form-control">
                                            <c:if test="${jsonData.data.ticketDetailsIsKill == 0}">
                                                <option selected value="0">否</option>
                                                <option value="1">是</option>
                                            </c:if>
                                            <c:if test="${jsonData.data.ticketDetailsIsKill == 1}">
                                                <option value="0">否</option>
                                                <option selected value="1">是</option>
                                            </c:if>
                                        </select>
                                    </div>
                                    <div class="col-md-2 title">演出城市</div>
                                    <div class="col-md-4 data">
                                        <input type="text" name="city" class="form-control" placeholder="演出城市"
                                               value="${jsonData.data.ticketAddressCity}">
                                    </div>
                                    <div class="col-md-2 title">演出场馆</div>
                                    <div class="col-md-4 data">
                                        <input type="text" name="venue" class="form-control" placeholder="演出场馆"
                                               value="${jsonData.data.ticketAddressVenue}">
                                    </div>

                                    <c:forEach items="${jsonData.data.ticketTime}" var="u" varStatus="status">
                                        <div class="col-md-2 title">演出时间${status.index+1}</div>
                                        <div class="col-md-4 data">
                                            <div class="input-group date">
                                                <div class="input-group-addon">
                                                    <i class="fa fa-calendar"></i>
                                                </div>
                                                <fmt:formatDate value="${u}" var="d1"
                                                                pattern="yyyy-MM-dd HH:mm"/>
                                                <input type="text" name="time${status.index+1}" class="form-control pull-right"
                                                       id="dateTimePicker${status.index+1}" value="${d1}">
                                            </div>
                                        </div>
                                    </c:forEach>

                                    <div class="col-md-2 title">权重值</div>
                                    <div class="col-md-4 data">
                                        <select name="ticketWeight" class="form-control">
                                            <c:forEach begin="0" end="10" varStatus="status">
                                                <c:if test="${jsonData.data.ticketDetailsWeight == status.index}">
                                                    <option selected
                                                            value="${status.index}">${status.index}</option>
                                                </c:if>
                                                <c:if test="${jsonData.data.ticketDetailsWeight != status.index}">
                                                    <option value="${status.index}">${status.index}</option>
                                                </c:if>
                                            </c:forEach>
                                        </select>
                                    </div>

                                    <div class="col-md-2 title">价格和座位</div>
                                    <div class="col-md-4 data">
                                        <p style="text-align: center;line-height: 40px;"><a
                                                href="${jsonData.data.ticketDetailsExcelAddress}">
                                            点击下载 <span style="color: #00acd6">${jsonData.data.ticketDetailsInfo} </span>座位和价格文件</a>
                                        </p>
                                    </div>
                                    <div class="col-md-2 title"
                                         style="text-align: center; line-height: 200px; height: 200px;">宣传图
                                    </div>
                                    <div class="col-md-10 data"
                                         style="text-align: center; height: 200px;">
                                        <div id="imgPreview">
                                            <img style="width: 217px;height: 180px;"
                                                 src="${jsonData.data.ticketDetailsTicketImgUrl}"/>
                                        </div>
                                    </div>

                                    <div class="col-md-2 title"
                                         style="text-align: center; line-height: 200px; height: 200px;">宣传图
                                    </div>
                                    <div class="col-md-10 data"
                                         style="text-align: center; height: 200px;">
                                        <div id="imgPreview_1">
                                            <div id="imgPreview_2">
                                                <img style="width: 217px;height: 180px;"
                                                     src="${jsonData.data.ticketDetailsTicketImgInfoUrl}"/>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-2 title"></div>
                                <div class="col-md-10 data text-center">
                                    <button type="submit" class="btn bg-maroon">更新</button>
                                    <button type="button" class="btn bg-default" onclick="history.back(-1);">返回</button>
                                </div>
                            </div>
                        </div>
                    </form>
                </section>
                <!-- 正文区域 /-->
            </div>
            <!-- 内容区域 /-->


            <!-- 底部导航 -->
            <jsp:include page="footer.jsp"/>
            <!-- 底部导航 /-->

        </div>
        <jsp:include page="footer-js.jsp"/>
        <script>
            $(document).ready(function () {
                // 选择框
                $(".select2").select2();

                // WYSIHTML5编辑器
                $(".textarea").wysihtml5({
                    locale: 'zh-CN'
                });
            });


            // 设置激活菜单
            function setSidebarActive(tagUri) {
                var liObj = $("#" + tagUri);
                if (liObj.length > 0) {
                    liObj.parent().parent().addClass("active");
                    liObj.addClass("active");
                }
            }


            $(document).ready(function () {

                // 颜色选取器
                $(".my-colorpicker1").colorpicker();
                $(".my-colorpicker2").colorpicker();

            });


            $(document).ready(function () {
                // 选择框
                $(".select2").select2();
            });


            $(document).ready(function () {

                //Date picker
                $('#datepicker').datepicker({
                    autoclose: true,
                    language: 'zh-CN'
                });

                //Date picker
                $('#datepicker2').datepicker({
                    autoclose: true,
                    language: 'zh-CN'
                });

                //Date picker
                $('#datepicker3').datepicker({
                    autoclose: true,
                    language: 'zh-CN'
                });

                // datetime picker
                $('#dateTimePicker1').datetimepicker({
                    format: "yyyy-mm-dd HH:mm",
                    autoclose: true,
                    todayBtn: true,
                    language: 'zh-CN'
                });

                // datetime picker
                $('#dateTimePicker2').datetimepicker({
                    format: "yyyy-mm-dd HH:mm",
                    autoclose: true,
                    todayBtn: true,
                    language: 'zh-CN'
                });

                // datetime picker
                $('#dateTimePicker3').datetimepicker({
                    format: "yyyy-mm-dd HH:mm",
                    autoclose: true,
                    todayBtn: true,
                    language: 'zh-CN'
                });

                // datetime picker
                $('#dateTimePicker4').datetimepicker({
                    format: "yyyy-MM-dd HH:mm",
                    autoclose: true,
                    todayBtn: true,
                    language: 'zh-CN'
                });
                //Date range picker
                $('#reservation').daterangepicker({
                    locale: {
                        applyLabel: '确认',
                        cancelLabel: '取消',
                        fromLabel: '起始时间',
                        toLabel: '结束时间',
                        customRangeLabel: '自定义',
                        firstDay: 1
                    },
                    opens: 'left', // 日期选择框的弹出位置
                    separator: ' 至 '
                    //showWeekNumbers : true,     // 是否显示第几周
                });

                //Date range picker with time picker
                $('#reservationtime').daterangepicker({
                    timePicker: true,
                    timePickerIncrement: 30,
                    format: 'MM/DD/YYYY h:mm A',
                    locale: {
                        applyLabel: '确认',
                        cancelLabel: '取消',
                        fromLabel: '起始时间',
                        toLabel: '结束时间',
                        customRangeLabel: '自定义',
                        firstDay: 1
                    },
                    opens: 'right', // 日期选择框的弹出位置
                    separator: ' 至 '
                });

                //Date range as a button
                $('#daterange-btn').daterangepicker({
                        locale: {
                            applyLabel: '确认',
                            cancelLabel: '取消',
                            fromLabel: '起始时间',
                            toLabel: '结束时间',
                            customRangeLabel: '自定义',
                            firstDay: 1
                        },
                        opens: 'right', // 日期选择框的弹出位置
                        separator: ' 至 ',
                        ranges: {
                            '今日': [moment(), moment()],
                            '昨日': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                            '最近7日': [moment().subtract(6, 'days'), moment()],
                            '最近30日': [moment().subtract(29, 'days'), moment()],
                            '本月': [moment().startOf('month'), moment().endOf('month')],
                            '上个月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
                        },
                        startDate: moment().subtract(29, 'days'),
                        endDate: moment()
                    },
                    function (start, end) {
                        $('#daterange-btn span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
                    }
                );
            });
            $(document).ready(function () {

                /*table tree*/
                $("#collapse-table").treetable({
                    expandable: true
                });
            });

            $(document).ready(function () {
                CKEDITOR.replace('editor1');
                // $(".textarea").wysihtml5({
                //     locale:'zh-CN'
                // });
                $("#markdown-textarea").markdown({
                    language: 'zh',
                    autofocus: false,
                    savable: false
                });

            });
            $(document).ready(function () {

                // 激活导航位置
                setSidebarActive("admin-dataform");

            });
        </script>
    </body>
</html>
<!---->
